<template>
<!-- 设置 -->
  <div class="Principal">
     <header>
      <div class="return">
        <i class="iconfont icon-zuojiantou"></i>
      </div>
      <div class="title">个人设置</div>
    </header>
    <main>
            <div class="myShezhi-one">
            <van-cell title="头像" is-link style=' border-top-left-radius:5px ; border-top-right-radius:5px'/>
            <van-cell title="昵称" is-link value="蓝叶兰" style=' border-bottom-right-radius:5px ; border-bottom-left-radius:5px'/>
            <img src="../../assets/img/tuxiang.png" alt="">
        </div>
        <div class="myShezhi-two">
            <van-cell title="证件信息" is-link  />
            <van-cell title="资质信息" is-link />
            <van-cell title="学历信息" is-link />
        </div>
        
        <div class="myShezhi-three">
            <van-cell title="账号信息管理" is-link />
        </div>
        <div class="myShezhi-four">
            <van-cell title="关于我们" is-link />
        </div>
    </main>
   <footer>
        <button class="btn3">退出登录</button>
   </footer>
  </div>
</template>
 
<script>

export default {
    data(){

        return{
 active: "",
      result: [],
      dataList: {
        list: [
          {
            imgSrc: "",
          
          },
        ],
      },
        }
    }
}
</script>

<style scoped lang="less">

.Principal{
    width: 100%;
    height: 100%;
    background-color: #ebebeb;
    height: 1334px;
      header {
    width: 100%;
    height: 88px;
    background-color: #ff5654;
    display: flex;
    .return {
      margin-left: 20px;
      i {
        color: #fff;
        font-size: 34px;
        line-height: 88px;
      }
    }
    .title {
      padding: 0 260px;
      color: #fff;
      font-size: 36px;
      line-height: 88px;
    }
  }
main{
        margin-top: 40px;
        .myShezhi-one{
        width: 700px;
      
        border: 1px solid #ccc;
        text-size-adjust: 16px;
        box-shadow: 0px 0px  1px 0px #ccc;
        border-radius: 50%;
        margin:0 20px 20px 20px;
        .van-cell  {
            border-top: 1px solid #ccc;
        }
        img{
            width: 60px;
            height: 60px;
            position: absolute;
            left: 590px;
            top: 145px;
            border-radius: 50%;
      
            
        }
    }
    .myShezhi-two{
        width: 700px;
        border: 1px solid #ccc;
        margin: 10px 20px;
     .van-cell--clickable:nth-child(1){
         border-bottom:1px solid #ebebeb;
     }
       .van-cell--clickable:nth-child(2){
         border-bottom:1px solid #ebebeb;
     }
    }
    .myShezhi-three{
        width: 700px;
        border: 1px solid #ccc;
        border-radius: 5px;
        margin: 10px 20px;
    }
    .myShezhi-four{
        width: 700px;
        border: 1px solid #ccc;
        text-size-adjust: 16px;
        box-shadow: 0px 0px  1px 0px #ccc;
        border-radius: 5px;
        margin: 10px 20px;
    }
}
  footer{
        .btn3{
        border:3px solid #ff5654;
        width: 700px;
        text-align: center;
        height: 70px;
        border-radius: 5px;
        margin: 338px 20px 0 20px;
        background-color: #ff5654;
        color: #fff;
        font-size: 20px;
    }
  }

     
}

</style>